<template>
  <div class="readonly-rate">
    <!-- 这是一个基于vant2的评分展示组件，只能读不能编辑，满分十分制 满星五星制 支持半星展示-->
    <van-rate
      v-model="starScore"
      :size="size"
      color="#e7c0a3"
      readonly
      allow-half
    />
    <div class="rate-text">{{ score }}分</div>
  </div>
</template>

<script>
export default {
  //这个分数是十分满分制度
  props: ["score", "size"],
  computed: {
    starScore() {
      return +(this.score / 2).toFixed(1);
    },
  },
};
</script>

<style lang="scss" scoped>
.readonly-rate {
  display: flex;
  align-items: center;
  > .rate-text {
    margin-left: 1.4vw;
    color: #e7c0a3;
  }
}
</style>